<template>
    <el-dialog :title="dialogTitle" v-model="visible" show-close draggable center align-center width="50%" height="auto">
        <el-text type="danger">{{ content }}</el-text>
        <el-container style="justify-content: center;">
            <el-button @click="handleCancel">取消</el-button>
            <el-button type="danger" @click="handleSubmit">删除</el-button>
        </el-container>
    </el-dialog>
</template>

<script setup lang="ts">
import { ref } from 'vue';

const visible = ref(false);
const dialogTitle = ref('');
const content = ref('');
let handleCancel = () => {};
let handleSubmit = () => {};
 
function openDialog(options: { title: string; content: string; handleCancel: () => void; handleSubmit: () => Promise<void> }) {
    dialogTitle.value = options.title;
    content.value = options.content;
    handleCancel = options.handleCancel;
    handleSubmit = options.handleSubmit;
    visible.value = true;
}

defineExpose({
  openDialog, visible, dialogTitle, content
});
</script>

<style scoped>
/* 样式代码 */
</style>